﻿@model CheckoutAttributeModel

@using Nop.Core.Domain.Catalog;

@Html.ValidationSummary(false)
@Html.HiddenFor(model => model.Id)

<div id="checkoutattribute-edit">
    <ul>
        <li @Html.RenderSelectedTabIndex(0, GetSelectedTabIndex())>
            @T("Admin.Catalog.Attributes.CheckoutAttributes.Info")
        </li>
        <li @Html.RenderSelectedTabIndex(1, GetSelectedTabIndex())>
            @T("Admin.Catalog.Attributes.CheckoutAttributes.Values")
        </li>
        <li @Html.RenderSelectedTabIndex(2, GetSelectedTabIndex())>
            @T("Admin.Catalog.Attributes.CheckoutAttributes.Stores")
        </li>
    </ul>
    <div>
        @TabInfo()
    </div>
    <div>
        @TabValues()
    </div>
    <div>
        @TabStores()
    </div>
</div>
<script>
    $(document).ready(function () {
        $("#checkoutattribute-edit").kendoTabStrip({
            animation: {
                open: {
                    effects: "fadeIn"
                }
            },
            select: tabstrip_on_tab_select
        });
    });
</script>

@{
    //custom tabs
    var eventMessage = new AdminTabStripCreated(this.Html, "checkoutattribute-edit");
    EngineContext.Current.Resolve<IEventPublisher>().Publish(eventMessage);
    foreach (var eventBlock in eventMessage.BlocksToRender)
    {
        @eventBlock
    }
}

@*save selected tab index*@
<input type="hidden" id="selected-tab-index" name="selected-tab-index" value="@(GetSelectedTabIndex())">

@helper TabInfo()
    {
        <script type="text/javascript">
            $(document).ready(function () {

                $("#@Html.FieldIdFor(model => model.IsTaxExempt)").click(toggleTax);
                $("#@Html.FieldIdFor(model => model.AttributeControlTypeId)").change(toggleAttributeControlType);

                toggleTax();
                toggleAttributeControlType();
            });

            function toggleTax() {
                if ($('#@Html.FieldIdFor(model => model.IsTaxExempt)').is(':checked')) {
                    $('#pnlTaxCategory').hide();
                } else {
                    $('#pnlTaxCategory').show();
                }
            }

            function toggleAttributeControlType() {
                var selectedAttributeControlTypeId = $("#@Html.FieldIdFor(model => model.AttributeControlTypeId)").val();
                if (selectedAttributeControlTypeId == @(((int) AttributeControlType.TextBox).ToString())) {
                    $('#pnlValidationMinLength').show();
                    $('#pnlValidationMaxLength').show();
                    $('#pnlValidationFileMaximumSize').hide();
                    $('#pnlValidationFileAllowedExtensions').hide();
                    $('#pnlDefaultValue').show();
                } else if (selectedAttributeControlTypeId == @(((int) AttributeControlType.MultilineTextbox).ToString())) {
                    $('#pnlValidationMinLength').show();
                    $('#pnlValidationMaxLength').show();
                    $('#pnlValidationFileMaximumSize').hide();
                    $('#pnlValidationFileAllowedExtensions').hide();
                    $('#pnlDefaultValue').show();
                } else if (selectedAttributeControlTypeId == @(((int) AttributeControlType.FileUpload).ToString())) {
                    $('#pnlValidationMinLength').hide();
                    $('#pnlValidationMaxLength').hide();
                    $('#pnlValidationFileMaximumSize').show();
                    $('#pnlValidationFileAllowedExtensions').show();
                    $('#pnlDefaultValue').hide();
                } else {
                    $('#pnlValidationMinLength').hide();
                    $('#pnlValidationMaxLength').hide();
                    $('#pnlValidationFileMaximumSize').hide();
                    $('#pnlValidationFileAllowedExtensions').hide();
                    $('#pnlDefaultValue').hide();
                }
            }
        </script>
        
    @(Html.LocalizedEditor<CheckoutAttributeModel, CheckoutAttributeLocalizedModel>("checkoutattribute-localized",
    @<table class="adminContent">
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.Locales[item].Name):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.Locales[item].Name)
                @Html.ValidationMessageFor(model => model.Locales[item].Name)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.Locales[item].TextPrompt):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.Locales[item].TextPrompt)
                @Html.ValidationMessageFor(model => model.Locales[item].TextPrompt)
            </td>
        </tr>
        <tr>
            <td colspan="2">
                @Html.HiddenFor(model => model.Locales[item].LanguageId)
            </td>
        </tr>
    </table>
    ,
    @<table class="adminContent">
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.Name):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.Name)
                @Html.ValidationMessageFor(model => model.Name)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.TextPrompt):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.TextPrompt)
                @Html.ValidationMessageFor(model => model.TextPrompt)
            </td>
        </tr>
    </table>
    ))
    <table class="adminContent">
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.IsRequired):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.IsRequired)
                @Html.ValidationMessageFor(model => model.IsRequired)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.ShippableProductRequired):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.ShippableProductRequired)
                @Html.ValidationMessageFor(model => model.ShippableProductRequired)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.IsTaxExempt):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.IsTaxExempt)
                @Html.ValidationMessageFor(model => model.IsTaxExempt)
            </td>
        </tr>
        <tr id="pnlTaxCategory">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.TaxCategoryId):
            </td>
            <td class="adminData">
                @Html.DropDownListFor(model => model.TaxCategoryId, Model.AvailableTaxCategories)
                @Html.ValidationMessageFor(model => model.TaxCategoryId)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.AttributeControlTypeId):
            </td>
            <td class="adminData">
                @Html.DropDownListFor(model => model.AttributeControlTypeId, ((AttributeControlType)Model.AttributeControlTypeId).ToSelectList())
                @Html.ValidationMessageFor(model => model.AttributeControlTypeId)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.DisplayOrder):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.DisplayOrder)
                @Html.ValidationMessageFor(model => model.DisplayOrder)
            </td>
        </tr>
        <tr id="pnlValidationMinLength">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.ValidationMinLength):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.ValidationMinLength)
                @Html.ValidationMessageFor(model => model.ValidationMinLength)
            </td>
        </tr>
        <tr id="pnlValidationMaxLength">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.ValidationMaxLength):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.ValidationMaxLength)
                @Html.ValidationMessageFor(model => model.ValidationMaxLength)
            </td>
        </tr>
        <tr id="pnlValidationFileAllowedExtensions">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.ValidationFileAllowedExtensions):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.ValidationFileAllowedExtensions)
                @Html.ValidationMessageFor(model => model.ValidationFileAllowedExtensions)
            </td>
        </tr>
        <tr id="pnlValidationFileMaximumSize">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.ValidationFileMaximumSize):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.ValidationFileMaximumSize)
                @Html.ValidationMessageFor(model => model.ValidationFileMaximumSize)
            </td>
        </tr>
        <tr id="pnlDefaultValue">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.DefaultValue):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.DefaultValue)
                @Html.ValidationMessageFor(model => model.DefaultValue)
            </td>
        </tr>
    </table>
        
    }
@helper TabValues()
    { 
        if (Model.Id > 0)
        {
            /*TODO display the following warning if values are not supported by selected attribute control type
             'Values are not required for this attribute control type'
             */
            <table class="adminContent">
                <tr>
                    <td>
                        <div id="checkoutattributevalues-grid"></div>

                        <script>
                            $(document).ready(function () {
                                $("#checkoutattributevalues-grid").kendoGrid({
                                    dataSource: {
                                        type: "json",
                                        transport: {
                                            read: {
                                                url: "@Html.Raw(Url.Action("ValueList", "CheckoutAttribute", new { checkoutAttributeId = Model.Id }))",
                                                type: "POST",
                                                dataType: "json"
                                            },
                                            destroy: {
                                                url: "@Html.Raw(Url.Action("ValueDelete", "CheckoutAttribute"))",
                                                type: "POST",
                                                dataType: "json"
                                            }
                                        },
                                        schema: {
                                            data: "Data",
                                            total: "Total",
                                            errors: "Errors",
                                            model: {
                                                id: "Id"
                                            }
                                        },
                                        error: function(e) {
                                            display_kendoui_grid_error(e);
                                            // Cancel the changes
                                            this.cancelChanges();
                                        },
                                        serverPaging: true,
                                        serverFiltering: true,
                                        serverSorting: true
                                    },
                                    pageable: {
                                        refresh: true,
                                        numeric: false,
                                        previousNext: false,
                                        info: false
                                    },
                                    editable: {
                                        confirmation: false,
                                        mode: "inline"
                                    },
                                    scrollable: false,
                                    columns: [{
                                        field: "Name",
                                        title: "@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.Fields.Name")"
                                    }, {
                                        field: "PriceAdjustment",
                                        title: "@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.Fields.PriceAdjustment")",
                                        width: 200
                                    }, {
                                        field: "WeightAdjustment",
                                        title: "@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.Fields.WeightAdjustment")",
                                        width: 200
                                    }, {
                                        field: "IsPreSelected",
                                        title: "@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.Fields.IsPreSelected")",
                                        width: 100,
                                        headerAttributes: { style: "text-align:center" },
                                        attributes: { style: "text-align:center" },
                                        template: '<img src="@Url.Content("~/Administration/Content/images/")active-#=IsPreSelected#.gif" />'
                                    }, {
                                        field: "DisplayOrder",
                                        title: "@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.Fields.DisplayOrder")",
                                        width: 100
                                    },{
                                        field: "Id",
                                        title: "@T("Admin.Common.Edit")",
                                        width: 100,
                                        template: "<input type='submit' value='@T("Admin.Common.Edit")' onclick=\"javascript:OpenWindow('@Url.Content("~/Admin/CheckoutAttribute/ValueEditPopup/")#=Id#?btnId=btnRefresh&formId=checkoutattribute-form', 800, 350, true); return false;\" class='k-button' />"
                                    }, {
                                        command: {name: "destroy", text: "@T("Admin.Common.Delete")"},
                                        title: "@T("Admin.Common.Delete")",
                                        width: 100
                                    }]
                                });
                            });
                        </script>
                    </td>
                </tr>
                <tr>
                    <td width="100%">
                        <input type="submit" id="btnAddNewValue" value="@T("Admin.Catalog.Attributes.CheckoutAttributes.Values.AddNew")" onclick="javascript:OpenWindow('@(Url.Action("ValueCreatePopup", "CheckoutAttribute", new { checkoutAttributeId = Model.Id, btnId = "btnRefresh", formId = "checkoutattribute-form" }))', 800, 350, true); return false;" class="k-button" />
                        <input type="submit" id="btnRefresh" style="display: none" />
                        <script type="text/javascript">
                            $(document).ready(function () {
                                $('#btnRefresh').click(function () {
                                    //refresh grid
                                    var grid = $("#checkoutattributevalues-grid").data('kendoGrid');
                                    grid.dataSource.read();

                                    //return false to don't reload a page
                                    return false;
                                });                                
                            });
                        </script>
                    </td>
                </tr>
            </table>
        }
        else
        {
            @T("Admin.Catalog.Attributes.CheckoutAttributes.Values.SaveBeforeEdit")
        }
    }

@helper TabStores()
{
    <script type="text/javascript">
        $(document).ready(function () {

            $("#@Html.FieldIdFor(model => model.LimitedToStores)").click(toggleStoreMapping);

            toggleStoreMapping();
        });


        function toggleStoreMapping() {
            if ($('#@Html.FieldIdFor(model => model.LimitedToStores)').is(':checked')) {
                $('#pnl-available-stores').show();
            }
            else {
                $('#pnl-available-stores').hide();
            }
        }

    </script>
    <table class="adminContent">
        <tr>
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.LimitedToStores):
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.LimitedToStores)
                @Html.ValidationMessageFor(model => model.LimitedToStores)
            </td>
        </tr>
        <tr id="pnl-available-stores">
            <td class="adminTitle">
                @Html.NopLabelFor(model => model.AvailableStores):
            </td>
            <td class="adminData">
                @if (Model.AvailableStores != null && Model.AvailableStores.Count > 0)
                {
                    foreach (var store in Model.AvailableStores)
                    {
                        <div>
                            <input type="checkbox" name="SelectedStoreIds" value="@store.Id" checked="@(Model.SelectedStoreIds != null && Model.SelectedStoreIds.Contains(store.Id))" />@store.Name
                        </div>
                    }
                }
                else
                {
                    <div>No stores defined</div>
                }
            </td>
        </tr>
    </table>
}